<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <title>临沂市消防监控系统</title>
    <link rel="stylesheet" href="../lib/css/bootstrop.css" />
    <link rel="stylesheet" href="../css/header.css">
    <link rel="stylesheet" href="../css/login.css">
    <link rel="stylesheet" href="../css/from.css">
    <link rel="stylesheet" href="../css/fire_first.css">
    <script src="../lib/js/uilt.config.js"></script>
    <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.10&key=62aefed2dd623a0f5042245bf44f362f&plugin=AMap.Autocomplete,AMap.PlaceSearch"></script>
</head>

<body>
<div class="con">
    <div class="head">
        <div class="row">
            <div class="col-md-3 text-center">
                <div class="head-time background">
                    2018年10月11号 16:23：21
                </div>
            </div>
            <div class="col-md-6 text-center">
                <div class="head-bt background">
                    消防联动预警平台
                </div>
            </div>
            <div class="col-md-3 text-right">
                <div class="head-add background text-center">消防一中队</div>
                <div class="head-btn background text-center"><a href="#">退出</a></div>
            </div>
        </div>
    </div>
    <div class="first-main">
        <div class="row">
            <div class="col-md-9">
                <div class="first-main-map background">
                    <div id="container" style="width: 100%;height: 100%;border-radius: 20px;" class="containerMap"></div>
                    <div class="trap-left"></div>
                    <div class="trap-right"></div>
                </div>
                <div class="first-list background">
                    <div class="list-bt">
                        <img src="../images/main_ld.png">
                        <p>报警信息显示列表</p>
                    </div>
                    <div class="list-nr">
                        <table class="text-center">
                            <thead>
                            <tr>
                                <th>选择</th>
                                <th>地图编号</th>
                                <th>微站编号</th>
                                <th>微站名称</th>
                                <th>距离火灾地(米)</th>
                                <th>负责人</th>
                                <th>联系电话1</th>
                                <th>联系电话2</th>
                                <th>所属辖区</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            <tr>
                                <td>
                                    <input type="checkbox">
                                </td>
                                <td>23312</td>
                                <td>12313</td>
                                <td>兰山区解放路</td>
                                <td>13000</td>
                                <td>林青霞</td>
                                <td>18987656676</td>
                                <td>13178987787</td>
                                <td>临沂市兰山区</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="col-md-3 first-list-nr">
                <div class="first_box background text-center">
                    <p>辖区一</p>
                    <input type="checkbox">
                    <table class="text-left">
                        <tbody>
                        <tr>
                            <td>编号：</td>
                            <td>08765</td>
                        </tr>
                        <tr>
                            <td>名称：</td>
                            <td>临沂市兰山区</td>
                        </tr>
                        <tr>
                            <td>负责人：</td>
                            <td>林青霞</td>
                        </tr>
                        <tr>
                            <td>联系电话1：</td>
                            <td>18232676656</td>
                        </tr>
                        <tr>
                            <td>联系电话2：</td>
                            <td>18677889989</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="first_box background text-center">
                    <p>辖区二</p>
                    <input type="checkbox">
                    <table class="text-left">
                        <tbody>
                        <tr>
                            <td>编号：</td>
                            <td>08765</td>
                        </tr>
                        <tr>
                            <td>名称：</td>
                            <td>临沂市兰山区</td>
                        </tr>
                        <tr>
                            <td>负责人：</td>
                            <td>林青霞</td>
                        </tr>
                        <tr>
                            <td>联系电话1：</td>
                            <td>18232676656</td>
                        </tr>
                        <tr>
                            <td>联系电话2：</td>
                            <td>18677889989</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="first_box background text-center">
                    <p>辖区三</p>
                    <input type="checkbox">
                    <table class="text-left">
                        <tbody>
                        <tr>
                            <td>编号：</td>
                            <td>08765</td>
                        </tr>
                        <tr>
                            <td>名称：</td>
                            <td>临沂市兰山区</td>
                        </tr>
                        <tr>
                            <td>负责人：</td>
                            <td>林青霞</td>
                        </tr>
                        <tr>
                            <td>联系电话1：</td>
                            <td>18232676656</td>
                        </tr>
                        <tr>
                            <td>联系电话2：</td>
                            <td>18677889989</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <div class="first_box background text-center">
                    <p>辖区四</p>
                    <input type="checkbox">
                    <table class="text-left">
                        <tbody>
                        <tr>
                            <td>编号：</td>
                            <td>08765</td>
                        </tr>
                        <tr>
                            <td>名称：</td>
                            <td>临沂市兰山区</td>
                        </tr>
                        <tr>
                            <td>负责人：</td>
                            <td>林青霞</td>
                        </tr>
                        <tr>
                            <td>联系电话1：</td>
                            <td>18232676656</td>
                        </tr>
                        <tr>
                            <td>联系电话2：</td>
                            <td>18677889989</td>
                        </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script src="../lib/js/jquery-3.1.1.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../lib/js/bootstrap.min.js"></script>
<script>
    $(function () {
        bind()
        // var cd =  todayTime()
        //console.log(cd)
    })
    var clickListener, map = new AMap.Map('container', {
        resizeEnable: true,
        center: [116.39, 39.9]
    });

    //搜索定位输入提示
    var autoOptions = {
        input: "tipinput"
    };
    var auto = new AMap.Autocomplete(autoOptions);
    var placeSearch = new AMap.PlaceSearch({
        map: map
    });  //构造地点查询类
    AMap.event.addListener(auto, "select", select);//注册监听，当选中某条记录时会触发
    function select(e) {
        placeSearch.setCity(e.poi.adcode);
        placeSearch.search(e.poi.name);  //关键字查询查询
    }
    //bt1的click的绑定事件
    var bind = function() {
        remove(); //防止重复绑定
        clickListener = AMap.event.addListener(map, "click", function(e) {
            console.log(e.lnglat)
            new AMap.Marker({
                position: e.lnglat,
                map: map
            });
        });
    };
    //bt2的click的绑定事件
    var remove = function() {
        if (clickListener) {
            AMap.event.removeListener(clickListener);//移除事件，以绑定时返回的对象作为参数
        }
    };
</script>
</html>